<template>
	<el-dialog :close-on-click-modal="false" title="授权" :visible.sync="show" v-if="show" width="45%" v-loading="loading">
		<el-form ref="form" :model="request.data" :inline="true" label-width="80px">
			<el-row>
				<el-col :span="12">
					<el-form-item label="权限">
						<div style="height: 300px;overflow: auto;">
							<tree
								ref="permissionTree"
								:items="permissions"
								:defaultExpandAll="true"
								:relationType="{ Y: 'ps', N: 'p' }"
								:checkedIds="request.data.pids"
								@check="changePermissions"
								:showCheckbox="true"
								:defaultParent="0"
							></tree>
						</div>
					</el-form-item>
				</el-col>
			</el-row>
		</el-form>
		<div slot="footer" class="dialog-footer">
			<el-button type="primary" @click="submitForm('form')" v-hasPermission="'000000150015'">确 定</el-button>
			<el-button @click="show = false">取 消</el-button>
		</div>
	</el-dialog>
</template>

<script>
import utils from 'util/utils.js';
import api from 'api/system/role/role.js';
import tree from 'components/tree/tree.vue';

export default {
	name: 'edit',
	components: {
		tree
	},
	data() {
		return {
			loading: false,
			show: this.isDisplay,
			request: utils.newRequest(),
			permissions: []
		};
	},
	props: {
		isDisplay: {
			type: Boolean,
			default() {
				return false;
			}
		},
		parameter: {
			type: Array | Object,
			default() {
				return {};
			}
		}
	},
	methods: {
		//提交表单
		submitForm(formName) {
			this.loading = true;
			//编辑
			api.authority(
				this.request,
				response => {
					utils.msg.success(response.msg);
					this.loading = false;
					this.show = false;
					this.$parent.list();
				},
				response => {
					utils.msg.warning(response.msg);
					this.loading = false;
				}
			);
		},
		changePermissions(data, CheckedObj) {
			this.request.data.pids = this.$refs.permissionTree.getSelectedIds();
		},
		init() {
			this.request = utils.newRequest();
			this.request.param.id = this.parameter.id;
			api.toAuthority(this.request, response => {
				this.request.data.id = this.parameter.id;
				this.request.data.pids = response.data.pids;
				this.permissions = response.data.permissions;
			});
		}
	},
	watch: {
		isDisplay(val) {
			this.show = val;
			if (val) {
				this.init();
			}
		},
		show(val) {
			this.$emit('update:isDisplay', val);
		},
		parameter(val) {
			this.parameter = val;
		}
	}
};
</script>

<style lang="scss"></style>
